<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/js/axios.min.js"></script>
    <script src="/js/util.js"></script>
    <script>
        function register() {
            var head = null;
            var objs = document.getElementsByName("face");
            for (var i = 0; i < objs.length; i++) {
                if (objs[i].checked) {
                    head = objs[i].value;
                    alert(head);
                }
            }
            if ($("pwd").value === $("confirmPwd").value) {
                axios.get("/user/add", {
                    params: {
                        name: $("userName").value,
                        pwd: $("pwd").value,
                        email: $("email").value,
                        head: head
                    }
                }).then(resp => {
                    var info = resp.data;
                    if (info == "ok") {
                        location.href = "/login.html";
                    }
                })
            } else {
                $("pwdError").innerHTML = "两次密码不一致";
            }
        }
    </script>
</head>
<body>
新用户注册<br>
<a href="/index.html">首页</a><br>
用户名：<input type="text" id="userName"><br>
用户密码：<input type="password" id="pwd"><br>
密码确定：<input type="password" id="confirmPwd">
<span id="pwdError"></span><br>
邮箱：<input type="text" id="email"><br>
用户头像
<input type="radio" name="face" value="1.jpg">
<img src="face/1.jpg" width="50px" height="50px">
<input type="radio" name="face" value="2.jpg">
<img src="face/2.jpg" width="50px" height="50px">
<input type="radio" name="face" value="3.jpg">
<img src="face/3.webp" width="50px" height="50px">
<input type="radio" name="face" value="4.jpg">
<img src="face/4.webp" width="50px" height="50px">
<input type="radio" name="face" value="5.jpg">
<img src="face/5.webp" width="50px" height="50px">
<br>
<input type="button" value="注册" onclick="register()">
</body>
</html>